<!DOCTYPE html>
<html>
<head>
    <title>基础表</title>
        <#include "/header.html">
	<style>

		.mixedDisplay{
			display: flex;
			justify-content: space-around;
			flex-wrap: wrap;
			align-items: center;
			height: auto;
			overflow: hidden;
			height: 20rem;

		}

		.itemOne{
			display: flex;
			justify-content: space-around;
			flex-wrap: nowrap;
			height: 10rem;
		}
		.itemTwo{
			display: flex;
			justify-content: space-around;
			flex-wrap: nowrap;
		}

		/*.itemOne{*/
		/*	flex: 2 1 20%;*/
		/*}*/
		/*.itemFile{*/
		/*	flex: 1 2 10%;*/
		/*}*/
		/*.itemBtn{*/
		/*	flex: 1 1 10%;*/
		/*}*/
		@media screen and (max-width: 500px) and (min-width: 300px) {
			/*input[type="file"]{*/
			/*	font-size: 10px;*/
			/*}*/
			.mixedDisplay{
				font-size: 9px !important;
				height: 10rem;

			}
			.itemOne{
				height: 5rem;
			}
		}

	</style>
</head>
<script src="${ctx}webjars/static/plugins/layui/layui.js"></script>

<script>
    layui.use(['laydate'], function () {
        var laydate = layui.laydate;

        //日期
        laydate.render({
            elem: '.date1'
        });
    });
</script>
<body>
<div class="layui-card lc-admin">
		<div class="layui-card-header lc-header-admin">
			<i class="fa fa-dropbox"></i> 信息列表
		</div>
		<div class="layui-card-body lc-body-admin">
				
		<div id="myapp" v-cloak>
			<#include "/excel.html">

			<div v-show="showList">
		        <div class="grid-btn">
		        	<div class="form-group col-sm-1 lc-query">
							<input type="text" class="form-control"  placeholder="名称" v-model="params.name">
					</div>
					<div class="form-group col-sm-1 lc-query">
						<input type="text" class="form-control" placeholder="备注" v-model="params.remark">
					</div>
					<template v-if="attributes != null && attributes.length > 0">
						<div class="form-group col-sm-1 lc-query">
							<select class="form-control" v-model="params.attributeId">
								<template v-for="attribute in attributes">
									<option :value="attribute.id">{{attribute.name}}</option>
								</template>

							</select>
						</div>
						<div class="form-group col-sm-2 lc-query">
							<input type="text" class="form-control" placeholder="选择下拉框字段名，再输入搜索内容" v-model="params.value">
						</div>

					</template>
					<a class="btn btn-default" @click="query"><i class="fa fa-search"></i>&nbsp;查询</a>
					<a class="btn btn-warning" @click="reset"><i class="fa fa-refresh"></i>&nbsp;重置</a>
		            <div class="btn-group btn-tools">
			            <#if shiro.hasPermission("BaseInfoController:save")>
			            <a class="btn btn-primary" @click="add"><i class="fa fa-plus"></i>&nbsp;新增</a>
			            </#if>
			            <#if shiro.hasPermission("BaseInfoController:update")>
			            <a class="btn btn-info" @click="update"><i class="fa fa-pencil-square-o"></i>&nbsp;修改</a>
			            </#if>
			            <#if shiro.hasPermission("BaseInfoController:delete")>
			            <a class="btn btn-danger" @click="del"><i class="fa fa-trash-o"></i>&nbsp;删除</a>
			            </#if>

			            <div class="btn-group" role="group" style="margin-left: 10px;">
							<button type="button" class="btn btn-success dropdown-toggle"
								data-toggle="dropdown" aria-haspopup="true"
								aria-expanded="false">
								<i class="fa fa-navicon"></i>导入/导出 <span class="caret"></span>
							</button>
							<ul class="dropdown-menu" style="min-width:110px;"> 
								<#if shiro.hasPermission("BaseInfoController:importExcel")>
					            <li><a  @click="openImportExcel"><i
										class="glyphicon glyphicon-upload"></i>&nbsp;导入</a></li>
					            </#if>
								<#if shiro.hasPermission("BaseInfoController:exportExcel")>
					            <li><a @click="exportExcel"><i
												class="glyphicon glyphicon-download"></i>&nbsp;导出</a></li>
					            </#if>
							</ul>
						</div>

		            </div>
		        </div>
		        <table id="jqGrid"></table>
		        <div id="jqGridPager" style="position: absolute; bottom: -39px;"></div>
		    </div>
		
		    <div v-show="!showList" class="panel panel-default">
		        <div class="panel-heading"><i class="fa fa-pencil-square-o"></i>{{title}}</div>
		        <form class="form-horizontal">
		            		                		            		                							                                <div class="form-group">
		                        <div class="col-sm-2 control-label">名字</div>
		                        <div class="col-sm-10">
		                            <input type="text" class="form-control" v-model="baseInfo.name" placeholder="名字"/>
		                        </div>
		                    </div>
					<!--<div class="form-group">-->
						<!--<div class="col-sm-2 control-label">分类id</div>-->
						<!--<div class="col-sm-10">-->
							<input type="hidden" class="form-control" id="categoryId" v-model="baseInfo.categoryId" placeholder="分类id"/>
						<!--</div>-->
					<!--</div>-->
		               	 		                		            		                							                                <div class="form-group">
		                        <div class="col-sm-2 control-label">排序</div>
		                        <div class="col-sm-10">
		                            <input type="number" class="form-control" v-model="baseInfo.orderNum" placeholder="排序"/>
		                        </div>
		                    </div>
							<template v-if="allAttributes != null && allAttributes.length > 0">
								<template v-for="attribute,attributeIndex in allAttributes">
									<div class="form-group">

										<div class="col-sm-2 control-label">
											<span style="color: red;" v-if="attribute.isMust==1">*</span>
											<span  v-text="attribute.name"></span>
										</div>
										<div class="col-sm-10">
											<textarea v-if="attribute.type==3" class="form-control" v-model="attribute.defaultValue"  :placeholder="attribute.help"></textarea>
											<div v-else-if="attribute.type==5" class="mixedDisplay">
												<div class="itemOne"  v-if="attribute.defaultValue">
													<img  :src="attribute.defaultValue" style="height: 5rem;"  @click="openFileUrl(attribute.defaultValue)" >
												</div>
												<div class="itemTwo">
													<div >
														<input type="file"  :id="'attribute'+attributeIndex" />
													</div>
													<div >
														<input type="button" class="btn btn-warning"  @click="simpleUploadMyFile(attributeIndex)" value="上传"/>
													</div>
												</div>

											</div>
											<div  v-else-if="attribute.type==6"  class="mixedDisplay">
												<div class="itemOne"  v-if="attribute.defaultValue">
													<video :src="attribute.defaultValue"   style="height: 5rem;"  @click="openFileUrl(attribute.defaultValue)" ></video>
												</div>
												<div class="itemTwo">
													<div >
														<input type="file"  :id="'attribute'+attributeIndex" />
													</div>
													<div >
														<input type="button" class="btn btn-warning"  @click="simpleUploadMyFile(attributeIndex)" value="上传"/>
													</div>
												</div>

											</div>

											<input v-else type="text" :class="[{ 'date1': attribute.type==2 }, 'form-control']" v-model="attribute.defaultValue"  :placeholder="attribute.help"/>
										</div>
									</div>
								</template>
							</template>
							 <div class="form-group">
		                        <div class="col-sm-2 control-label">备注信息</div>
		                        <div class="col-sm-10">
									<textarea type="text" class="form-control" v-model="baseInfo.remark" placeholder="备注信息"></textarea>
		                        </div>
		                    </div>
		               	 		                		            		                									                		            		            <div class="form-group">
		                <div class="col-sm-2 control-label"></div>
		                <input type="button" class="btn btn-primary" @click="saveOrUpdate" value="确定"/>
		                &nbsp;&nbsp;<input type="button" class="btn btn-warning" @click="reload" value="返回"/>
		            </div>
		        </form>
		    </div>
		</div>
	</div>
</div>
	
<script src="${ctx}webjars/static/js/modules/diy/baseinfo.js?_${.now?long}"></script>
</body>
</html>